import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:gourmet/color/hex.dart';
import 'package:gourmet/extensions/ex_widget.dart';
import 'package:gourmet/ui/triangle.dart';
import 'package:gourmet/utils/colors.dart';
import 'package:gourmet/utils/styles.dart';
import 'package:gourmet/utils/tools.dart';
import 'package:popup_menu_plus/popup_menu_plus.dart';

class GoodsCollectController extends GetxController {
  final GlobalKey iconKey = GlobalKey(debugLabel: 'iconKey');

  PopupMenu? menu;
}

class GoodsCollectView extends GetView<GoodsCollectController> {
  const GoodsCollectView({super.key});

  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        Container(
          margin: EdgeInsets.only(
              top: 10,
              left: (Get.width - 345) / 2,
              right: (Get.width - 345) / 2),
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(10),
          ),
          padding:
              const EdgeInsets.only(top: 15, left: 15, right: 10, bottom: 15),
          alignment: Alignment.centerLeft,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.start,
                children: [
                  Image.network(
                    'https://img1.baidu.com/it/u=4078247928,1880753920&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500',
                    width: 100,
                    height: 100,
                    fit: BoxFit.fill,
                  ),
                  Padding(
                    padding: const EdgeInsets.only(left: 10),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '香辣鸡翅汉堡',
                              style: StylesUtils.customTextStyle(
                                fontSize: StylesUtils.fontSize16,
                                fontWeight: FontWeight.w700,
                                color: ColorsUtils.color0000,
                              ),
                            ),
                            Icon(
                              key: controller.iconKey,
                              CupertinoIcons.ellipsis,
                              size: 15,
                              color: HexColor(ColorsUtils.color0000),
                            ).onTap(() {
                              openMenu(context);
                            }),
                          ],
                        ),
                        Container(
                          margin: const EdgeInsets.only(top: 10, bottom: 10),
                          alignment: Alignment.centerLeft,
                          child: Text(
                            '月售10',
                            style: StylesUtils.customTextStyle(
                              fontSize: StylesUtils.fontSize12,
                              color: ColorsUtils.color7979,
                            ),
                          ),
                        ),
                        Align(
                          alignment: Alignment.centerLeft,
                          child: Container(
                            constraints: const BoxConstraints.expand(
                                width: 40, height: 16),
                            alignment: Alignment.center,
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(3),
                              border: Border.all(
                                color: HexColor(ColorsUtils.colorFf64),
                              ),
                            ),
                            child: Text(
                              '8.3折',
                              style: StylesUtils.customTextStyle(
                                fontSize: StylesUtils.fontSize12,
                                color: ColorsUtils.colorFf64,
                              ),
                            ),
                          ),
                        ),
                        Container(
                          margin: const EdgeInsets.only(top: 10),
                          alignment: Alignment.centerLeft,
                          child: Wrap(
                            spacing: 15,
                            alignment: WrapAlignment.start,
                            crossAxisAlignment: WrapCrossAlignment.center,
                            children: [
                              Text(
                                '￥25',
                                style: StylesUtils.customTextStyle(
                                    fontWeight: FontWeight.w700,
                                    fontSize: StylesUtils.fontSize16,
                                    color: ColorsUtils.colorFf64),
                              ),
                              Text(
                                '￥30',
                                style: StylesUtils.customTextStyle(
                                  fontSize: StylesUtils.fontSize12,
                                  color: ColorsUtils.color9999,
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ).expand(),
                ],
              ),
              Padding(
                padding: const EdgeInsets.only(top: 10),
                child: Row(
                  children: [
                    Image.network(
                      'https://img2.baidu.com/it/u=925468304,3986454037&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=510',
                      width: 20,
                      height: 20,
                      fit: BoxFit.fill,
                    ),
                    Container(
                      margin: const EdgeInsets.only(left: 5, right: 15),
                      alignment: Alignment.centerLeft,
                      child: Text(
                        '华莱士·全鸡汉堡-凤凰广场北门电梯3楼',
                        style: StylesUtils.customTextStyle(
                          color: ColorsUtils.color0000,
                          fontSize: StylesUtils.fontSize12,
                        ),
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                      ),
                    ).limitedBox(maxWidth: 150),
                    Text.rich(
                      TextSpan(
                        children: [
                          TextSpan(
                            text: '4.5分  ',
                            style: StylesUtils.customTextStyle(
                              color: ColorsUtils.colorFf66,
                              fontSize: StylesUtils.fontSize12,
                            ),
                          ),
                          TextSpan(
                            text: '配送￥4',
                            style: StylesUtils.customTextStyle(
                              color: ColorsUtils.color7979,
                              fontSize: StylesUtils.fontSize12,
                            ),
                          ),
                          TextSpan(
                            text: '  30分钟',
                            style: StylesUtils.customTextStyle(
                              fontSize: StylesUtils.fontSize12,
                              color: ColorsUtils.color6666,
                            ),
                          ),
                        ],
                      ),
                    ).alignCenterLeft(),
                  ],
                ),
              ),
            ],
          ),
        ),
        Container(
          height: 50,
          alignment: Alignment.center,
          child: Text(
            '已经到底了~',
            style: StylesUtils.customTextStyle(
              color: ColorsUtils.color9999,
            ),
          ),
        ),
      ],
    );
  }

  void openMenu(BuildContext context) {
    controller.menu ??= PopupMenu(
        context: context,
        content: Container(
          width: 90,
          height: 40,
          alignment: Alignment.center,
          color: HexColor(ColorsUtils.color3333).withOpacity(0.898039),
          child: Text(
            '取消收藏',
            style: StylesUtils.customTextStyle(
              fontSize: StylesUtils.fontSize15,
            ),
          ),
        ).onTap(() {
          controller.menu?.dismiss();
        }),
        config: const MenuConfig(
            type: MenuType.custom,
            itemHeight: 40,
            itemWidth: 90,
            borderRadius: BorderRadius.all(Radius.circular(5))),
        onDismiss: () {
          Get.log('onDiss');
        });
    controller.menu!.show(widgetKey: controller.iconKey);
  }
}

class StoreCollectController extends GetxController {
  final GlobalKey iconStoreKey = GlobalKey(debugLabel: 'iconStoreKey');

  PopupMenu? menu;

  List<String> tags = ['满50减3', '100减6', '150减10', '8.5折起'];
}

class StoreCollectView extends GetView<StoreCollectController> {
  const StoreCollectView({super.key});

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: [
          Container(
            margin: EdgeInsets.only(
                top: 10,
                left: (Get.width - 345) / 2,
                right: (Get.width - 345) / 2),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(10),
            ),
            padding:
                const EdgeInsets.only(top: 15, left: 15, right: 10, bottom: 15),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Image.network(
                      'https://img1.baidu.com/it/u=4078247928,1880753920&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500',
                      width: 60,
                      height: 60,
                      fit: BoxFit.fill,
                    ),
                    Padding(
                      padding: const EdgeInsets.only(left: 10),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        mainAxisAlignment: MainAxisAlignment.start,
                        children: [
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Text(
                                '华莱士-凤凰广场2店',
                                style: StylesUtils.customTextStyle(
                                  fontSize: StylesUtils.fontSize16,
                                  fontWeight: FontWeight.w700,
                                  color: ColorsUtils.color0000,
                                ),
                              ),
                              Icon(
                                key: controller.iconStoreKey,
                                CupertinoIcons.ellipsis,
                                size: 15,
                                color: HexColor(ColorsUtils.color0000),
                              ).onTap(() {
                                openMenu(context);
                              }),
                            ],
                          ),
                          Container(
                            margin: const EdgeInsets.only(top: 10, bottom: 10),
                            alignment: Alignment.centerLeft,
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text.rich(
                                  TextSpan(
                                    children: [
                                      TextSpan(
                                        text: '4.5分  ',
                                        style: StylesUtils.customTextStyle(
                                          fontSize: StylesUtils.fontSize12,
                                          color: ColorsUtils.colorFf66,
                                        ),
                                      ),
                                      TextSpan(
                                        text: '月售502  人均￥45',
                                        style: StylesUtils.customTextStyle(
                                          fontSize: StylesUtils.fontSize12,
                                          color: ColorsUtils.color7979,
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                Container(
                                  constraints: const BoxConstraints.expand(
                                      width: 60, height: 20),
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(3),
                                    color: ColorsUtils.rgba(250, 245, 245, 1),
                                  ),
                                  alignment: Alignment.center,
                                  child: Text(
                                    '平台专送',
                                    style: StylesUtils.customTextStyle(
                                      fontSize: StylesUtils.fontSize12,
                                      color: ColorsUtils.colorFf64,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Text(
                                '起送￥20  免配送费',
                                style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color7979,
                                  fontSize: StylesUtils.fontSize12,
                                ),
                              ),
                              Text(
                                '20分钟  2.2km',
                                style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color7979,
                                  fontSize: StylesUtils.fontSize12,
                                ),
                              ),
                            ],
                          ),
                          Container(
                            margin: const EdgeInsets.only(top: 10),
                            alignment: Alignment.centerLeft,
                            child: Wrap(
                              spacing: 5,
                              alignment: WrapAlignment.start,
                              crossAxisAlignment: WrapCrossAlignment.center,
                              children: controller.tags
                                  .map(
                                    (str) => Builder(builder: (_) {
                                      final style = StylesUtils.customTextStyle(
                                        color: ColorsUtils.colorFf64,
                                        fontSize: StylesUtils.fontSize12,
                                      );
                                      final width =
                                          ToolsUtils.calculateTextWidth(
                                              style: style, value: str);
                                      return Container(
                                        constraints: BoxConstraints.expand(
                                            width: width + 10, height: 16),
                                        decoration: BoxDecoration(
                                          borderRadius:
                                              BorderRadius.circular(3),
                                          border: Border.all(
                                            color:
                                                HexColor(ColorsUtils.colorFf64),
                                          ),
                                        ),
                                        alignment: Alignment.center,
                                        child: Text(
                                          str,
                                          style: style,
                                        ),
                                      );
                                    }),
                                  )
                                  .toList(),
                            ),
                          ),
                        ],
                      ),
                    ).expand(),
                  ],
                ),
              ],
            ),
          ),
          Container(
            height: 40,
            alignment: Alignment.centerLeft,
            padding: EdgeInsets.only(left: (Get.width - 345) / 2),
            child: Text(
              '超出配送范围',
              style: StylesUtils.customTextStyle(
                color: ColorsUtils.color0000,
                fontSize: StylesUtils.fontSize13,
                fontWeight: FontWeight.w700,
              ),
            ),
          ),
          Container(
            margin: EdgeInsets.only(
                left: (Get.width - 345) / 2, right: (Get.width - 345) / 2),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(10),
            ),
            padding:
                const EdgeInsets.only(top: 15, left: 15, right: 10, bottom: 15),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Image.network(
                      'https://img2.baidu.com/it/u=146979649,719452986&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500',
                      width: 60,
                      height: 60,
                      fit: BoxFit.fill,
                    ),
                    Padding(
                      padding: const EdgeInsets.only(left: 10),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        mainAxisAlignment: MainAxisAlignment.start,
                        children: [
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Text(
                                '麦当劳-凤凰广场店',
                                style: StylesUtils.customTextStyle(
                                  fontSize: StylesUtils.fontSize16,
                                  fontWeight: FontWeight.w700,
                                  color: ColorsUtils.color0000,
                                ),
                              ),
                              PopupMenuButton<int>(
                                itemBuilder: (_) {
                                  return [
                                    PopupMenuItem(
                                      value: 1,
                                      child: Container(
                                        constraints:
                                            const BoxConstraints.expand(
                                                width: 90, height: 40),
                                        alignment: Alignment.center,
                                        child: Text(
                                          '取消收藏',
                                          style: StylesUtils.customTextStyle(
                                            fontSize: StylesUtils.fontSize15,
                                          ),
                                        ),
                                      ),
                                    ),
                                    PopupMenuItem(
                                      value: 2,
                                      child: Container(
                                        constraints:
                                            const BoxConstraints.expand(
                                                width: 90, height: 40),
                                        alignment: Alignment.center,
                                        child: Text(
                                          '找相似的',
                                          style: StylesUtils.customTextStyle(
                                            fontSize: StylesUtils.fontSize15,
                                          ),
                                        ),
                                      ),
                                    )
                                  ];
                                },
                                elevation: 0,
                                padding: EdgeInsets.zero,
                                color: HexColor(ColorsUtils.color3333)
                                    .withOpacity(0.898039),
                                splashRadius: 5,
                                position: PopupMenuPosition.under,
                                constraints: const BoxConstraints(maxWidth: 90),
                                offset: const Offset(10, 0),
                                child: Icon(
                                  CupertinoIcons.ellipsis,
                                  size: 15,
                                  color: HexColor(
                                    ColorsUtils.color0000,
                                  ),
                                ),
                              ),
                            ],
                          ),
                          Container(
                            margin: const EdgeInsets.only(top: 10, bottom: 10),
                            alignment: Alignment.centerLeft,
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text.rich(
                                  TextSpan(
                                    children: [
                                      TextSpan(
                                        text: '4.5分  ',
                                        style: StylesUtils.customTextStyle(
                                          fontSize: StylesUtils.fontSize12,
                                          color: ColorsUtils.colorFf66,
                                        ),
                                      ),
                                      TextSpan(
                                        text: '月售502  人均￥45',
                                        style: StylesUtils.customTextStyle(
                                          fontSize: StylesUtils.fontSize12,
                                          color: ColorsUtils.color7979,
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                Container(
                                  constraints: const BoxConstraints.expand(
                                      width: 60, height: 20),
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(3),
                                    color: ColorsUtils.rgba(250, 245, 245, 1),
                                  ),
                                  alignment: Alignment.center,
                                  child: Text(
                                    '平台专送',
                                    style: StylesUtils.customTextStyle(
                                      fontSize: StylesUtils.fontSize12,
                                      color: ColorsUtils.colorFf64,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Text(
                                '起送￥20  免配送费',
                                style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color7979,
                                  fontSize: StylesUtils.fontSize12,
                                ),
                              ),
                              Text(
                                '20分钟  2.2km',
                                style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color7979,
                                  fontSize: StylesUtils.fontSize12,
                                ),
                              ),
                            ],
                          ),
                          Container(
                            margin: const EdgeInsets.only(top: 10),
                            alignment: Alignment.centerLeft,
                            child: Wrap(
                              spacing: 5,
                              alignment: WrapAlignment.start,
                              crossAxisAlignment: WrapCrossAlignment.center,
                              children: controller.tags
                                  .map(
                                    (str) => Builder(builder: (_) {
                                      final style = StylesUtils.customTextStyle(
                                        color: ColorsUtils.colorFf64,
                                        fontSize: StylesUtils.fontSize12,
                                      );
                                      final width =
                                          ToolsUtils.calculateTextWidth(
                                              style: style, value: str);
                                      return Container(
                                        constraints: BoxConstraints.expand(
                                            width: width + 10, height: 16),
                                        decoration: BoxDecoration(
                                          borderRadius:
                                              BorderRadius.circular(3),
                                          border: Border.all(
                                            color:
                                                HexColor(ColorsUtils.colorFf64),
                                          ),
                                        ),
                                        alignment: Alignment.center,
                                        child: Text(
                                          str,
                                          style: style,
                                        ),
                                      );
                                    }),
                                  )
                                  .toList(),
                            ),
                          ),
                        ],
                      ),
                    ).expand(),
                  ],
                ),
              ],
            ),
          ),
          Container(
            height: 40,
            alignment: Alignment.centerLeft,
            padding: EdgeInsets.only(left: (Get.width - 345) / 2),
            child: Text(
              '休息中',
              style: StylesUtils.customTextStyle(
                color: ColorsUtils.color0000,
                fontSize: StylesUtils.fontSize13,
                fontWeight: FontWeight.w700,
              ),
            ),
          ),
          Container(
            margin: EdgeInsets.only(
                left: (Get.width - 345) / 2, right: (Get.width - 345) / 2),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(10),
            ),
            padding:
                const EdgeInsets.only(top: 15, left: 15, right: 10, bottom: 15),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Image.network(
                      'https://img0.baidu.com/it/u=674491115,2187096604&fm=253&fmt=auto&app=138&f=JPEG?w=591&h=500',
                      width: 60,
                      height: 60,
                      fit: BoxFit.fill,
                    ),
                    Padding(
                      padding: const EdgeInsets.only(left: 10),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        mainAxisAlignment: MainAxisAlignment.start,
                        children: [
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Text(
                                '顺德佬-人民北路店',
                                style: StylesUtils.customTextStyle(
                                  fontSize: StylesUtils.fontSize16,
                                  fontWeight: FontWeight.w700,
                                  color: ColorsUtils.color0000,
                                ),
                              ),
                              PopupMenuButton<int>(
                                itemBuilder: (_) {
                                  return [
                                    PopupMenuItem(
                                      value: 1,
                                      child: Stack(
                                        children: [
                                          Container(
                                            constraints:
                                                const BoxConstraints.expand(
                                                    width: 90, height: 40),
                                            alignment: Alignment.center,
                                            child: Text(
                                              '取消收藏',
                                              style:
                                                  StylesUtils.customTextStyle(
                                                fontSize:
                                                    StylesUtils.fontSize15,
                                              ),
                                            ),
                                          ),
                                          Transform.translate(
                                            offset: const Offset(30, -22),
                                            child: Container(
                                              height: 10,
                                              color: Colors.transparent,
                                              alignment: Alignment.center,
                                              child: CustomPaint(
                                                size: const Size(15, 10),
                                                painter: TrianglePainter(
                                                  isDown: false,
                                                  color: HexColor(
                                                          ColorsUtils.color3333)
                                                      .withOpacity(0.898039),
                                                  border:
                                                      BorderSetting(width: 0),
                                                ),
                                              ),
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                    PopupMenuItem(
                                      value: 2,
                                      child: Container(
                                        constraints:
                                            const BoxConstraints.expand(
                                                width: 90, height: 40),
                                        alignment: Alignment.center,
                                        child: Text(
                                          '找相似的',
                                          style: StylesUtils.customTextStyle(
                                            fontSize: StylesUtils.fontSize15,
                                          ),
                                        ),
                                      ),
                                    )
                                  ];
                                },
                                elevation: 0,
                                padding: EdgeInsets.zero,
                                color: HexColor(ColorsUtils.color3333)
                                    .withOpacity(0.898039),
                                splashRadius: 5,
                                position: PopupMenuPosition.under,
                                constraints: const BoxConstraints(maxWidth: 90),
                                offset: const Offset(10, 10),
                                child: Icon(
                                  CupertinoIcons.ellipsis,
                                  size: 15,
                                  color: HexColor(
                                    ColorsUtils.color0000,
                                  ),
                                ),
                              ),
                            ],
                          ),
                          Container(
                            margin: const EdgeInsets.only(top: 10, bottom: 10),
                            alignment: Alignment.centerLeft,
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text.rich(
                                  TextSpan(
                                    children: [
                                      TextSpan(
                                        text: '4.5分  ',
                                        style: StylesUtils.customTextStyle(
                                          fontSize: StylesUtils.fontSize12,
                                          color: ColorsUtils.colorFf66,
                                        ),
                                      ),
                                      TextSpan(
                                        text: '月售502  人均￥45',
                                        style: StylesUtils.customTextStyle(
                                          fontSize: StylesUtils.fontSize12,
                                          color: ColorsUtils.color7979,
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                Container(
                                  constraints: const BoxConstraints.expand(
                                      width: 60, height: 20),
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(3),
                                    color: ColorsUtils.rgba(250, 245, 245, 1),
                                  ),
                                  alignment: Alignment.center,
                                  child: Text(
                                    '平台专送',
                                    style: StylesUtils.customTextStyle(
                                      fontSize: StylesUtils.fontSize12,
                                      color: ColorsUtils.colorFf64,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Text(
                                '起送￥20  免配送费',
                                style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color7979,
                                  fontSize: StylesUtils.fontSize12,
                                ),
                              ),
                              Text(
                                '20分钟  2.2km',
                                style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color7979,
                                  fontSize: StylesUtils.fontSize12,
                                ),
                              ),
                            ],
                          ),
                          Container(
                            margin: const EdgeInsets.only(top: 10),
                            alignment: Alignment.centerLeft,
                            child: Wrap(
                              spacing: 5,
                              alignment: WrapAlignment.start,
                              crossAxisAlignment: WrapCrossAlignment.center,
                              children: controller.tags
                                  .map(
                                    (str) => Builder(builder: (_) {
                                      final style = StylesUtils.customTextStyle(
                                        color: ColorsUtils.colorFf64,
                                        fontSize: StylesUtils.fontSize12,
                                      );
                                      final width =
                                          ToolsUtils.calculateTextWidth(
                                              style: style, value: str);
                                      return Container(
                                        constraints: BoxConstraints.expand(
                                            width: width + 10, height: 16),
                                        decoration: BoxDecoration(
                                          borderRadius:
                                              BorderRadius.circular(3),
                                          border: Border.all(
                                            color:
                                                HexColor(ColorsUtils.colorFf64),
                                          ),
                                        ),
                                        alignment: Alignment.center,
                                        child: Text(
                                          str,
                                          style: style,
                                        ),
                                      );
                                    }),
                                  )
                                  .toList(),
                            ),
                          ),
                        ],
                      ),
                    ).expand(),
                  ],
                ),
              ],
            ),
          ),
          Container(
            height: 40,
            alignment: Alignment.centerLeft,
            padding: EdgeInsets.only(left: (Get.width - 345) / 2),
            child: Text(
              '已下线',
              style: StylesUtils.customTextStyle(
                color: ColorsUtils.color0000,
                fontSize: StylesUtils.fontSize13,
                fontWeight: FontWeight.w700,
              ),
            ),
          ),
          Opacity(
            opacity: 0.5,
            child: Container(
              margin: EdgeInsets.only(
                  left: (Get.width - 345) / 2, right: (Get.width - 345) / 2),
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(10),
              ),
              padding: const EdgeInsets.only(
                  top: 15, left: 15, right: 10, bottom: 15),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Image.network(
                        'https://img2.baidu.com/it/u=259178695,887234081&fm=253&fmt=auto&app=138&f=JPEG?w=595&h=500',
                        width: 60,
                        height: 60,
                        fit: BoxFit.fill,
                      ),
                      Padding(
                        padding: const EdgeInsets.only(left: 10),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text(
                                  '顺德佬-人民北路店',
                                  style: StylesUtils.customTextStyle(
                                    fontSize: StylesUtils.fontSize16,
                                    fontWeight: FontWeight.w700,
                                    color: ColorsUtils.color0000,
                                  ),
                                ),
                                PopupMenuButton<int>(
                                  itemBuilder: (_) {
                                    return [
                                      PopupMenuItem(
                                        value: 1,
                                        child: Stack(
                                          children: [
                                            Container(
                                              constraints:
                                                  const BoxConstraints.expand(
                                                      width: 90, height: 40),
                                              alignment: Alignment.center,
                                              child: Text(
                                                '取消收藏',
                                                style:
                                                    StylesUtils.customTextStyle(
                                                  fontSize:
                                                      StylesUtils.fontSize15,
                                                ),
                                              ),
                                            ),
                                            Transform.translate(
                                              offset: const Offset(30, -22),
                                              child: Container(
                                                height: 10,
                                                color: Colors.transparent,
                                                alignment: Alignment.center,
                                                child: CustomPaint(
                                                  size: const Size(15, 10),
                                                  painter: TrianglePainter(
                                                    isDown: false,
                                                    color: HexColor(ColorsUtils
                                                            .color3333)
                                                        .withOpacity(0.898039),
                                                    border:
                                                        BorderSetting(width: 0),
                                                  ),
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                      PopupMenuItem(
                                        value: 2,
                                        child: Container(
                                          constraints:
                                              const BoxConstraints.expand(
                                                  width: 90, height: 40),
                                          alignment: Alignment.center,
                                          child: Text(
                                            '找相似的',
                                            style: StylesUtils.customTextStyle(
                                              fontSize: StylesUtils.fontSize15,
                                            ),
                                          ),
                                        ),
                                      )
                                    ];
                                  },
                                  elevation: 0,
                                  padding: EdgeInsets.zero,
                                  color: HexColor(ColorsUtils.color3333)
                                      .withOpacity(0.898039),
                                  splashRadius: 5,
                                  position: PopupMenuPosition.under,
                                  constraints:
                                      const BoxConstraints(maxWidth: 90),
                                  offset: const Offset(10, 10),
                                  child: Icon(
                                    CupertinoIcons.ellipsis,
                                    size: 15,
                                    color: HexColor(
                                      ColorsUtils.color0000,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                            Container(
                              margin:
                                  const EdgeInsets.only(top: 10, bottom: 10),
                              alignment: Alignment.centerLeft,
                              child: Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: [
                                  Text.rich(
                                    TextSpan(
                                      children: [
                                        TextSpan(
                                          text: '4.5分  ',
                                          style: StylesUtils.customTextStyle(
                                            fontSize: StylesUtils.fontSize12,
                                            color: ColorsUtils.colorFf66,
                                          ),
                                        ),
                                        TextSpan(
                                          text: '月售502  人均￥45',
                                          style: StylesUtils.customTextStyle(
                                            fontSize: StylesUtils.fontSize12,
                                            color: ColorsUtils.color7979,
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                  Container(
                                    constraints: const BoxConstraints.expand(
                                        width: 60, height: 20),
                                    decoration: BoxDecoration(
                                      borderRadius: BorderRadius.circular(3),
                                      color: ColorsUtils.rgba(250, 245, 245, 1),
                                    ),
                                    alignment: Alignment.center,
                                    child: Text(
                                      '平台专送',
                                      style: StylesUtils.customTextStyle(
                                        fontSize: StylesUtils.fontSize12,
                                        color: ColorsUtils.colorFf64,
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text(
                                  '起送￥20  免配送费',
                                  style: StylesUtils.customTextStyle(
                                    color: ColorsUtils.color7979,
                                    fontSize: StylesUtils.fontSize12,
                                  ),
                                ),
                                Text(
                                  '20分钟  2.2km',
                                  style: StylesUtils.customTextStyle(
                                    color: ColorsUtils.color7979,
                                    fontSize: StylesUtils.fontSize12,
                                  ),
                                ),
                              ],
                            ),
                            Container(
                              margin: const EdgeInsets.only(top: 10),
                              alignment: Alignment.centerLeft,
                              child: Wrap(
                                spacing: 5,
                                alignment: WrapAlignment.start,
                                crossAxisAlignment: WrapCrossAlignment.center,
                                children: controller.tags
                                    .map(
                                      (str) => Builder(builder: (_) {
                                        final style =
                                            StylesUtils.customTextStyle(
                                          color: ColorsUtils.colorFf64,
                                          fontSize: StylesUtils.fontSize12,
                                        );
                                        final width =
                                            ToolsUtils.calculateTextWidth(
                                                style: style, value: str);
                                        return Container(
                                          constraints: BoxConstraints.expand(
                                              width: width + 10, height: 16),
                                          decoration: BoxDecoration(
                                            borderRadius:
                                                BorderRadius.circular(3),
                                            border: Border.all(
                                              color: HexColor(
                                                  ColorsUtils.colorFf64),
                                            ),
                                          ),
                                          alignment: Alignment.center,
                                          child: Text(
                                            str,
                                            style: style,
                                          ),
                                        );
                                      }),
                                    )
                                    .toList(),
                              ),
                            ),
                          ],
                        ),
                      ).expand(),
                    ],
                  ),
                ],
              ),
            ),
          ),
          Container(
            height: 50,
            alignment: Alignment.center,
            child: Text(
              '已经到底了~',
              style: StylesUtils.customTextStyle(color: ColorsUtils.color9999),
            ),
          ),
        ],
      ),
    );
  }

  void openMenu(BuildContext context) {
    controller.menu ??= PopupMenu(
        context: context,
        content: Column(
          children: [
            Container(
              height: 40,
              alignment: Alignment.center,
              child: Text(
                '取消收藏',
                style: StylesUtils.customTextStyle(
                  fontSize: StylesUtils.fontSize15,
                ),
              ),
            ).onTap(() {
              controller.menu?.dismiss();
            }),
            Container(
              height: 40,
              alignment: Alignment.center,
              child: Text(
                '找相似的',
                style: StylesUtils.customTextStyle(
                  fontSize: StylesUtils.fontSize15,
                ),
              ),
            ).onTap(() {
              controller.menu?.dismiss();
            }),
          ],
        ),
        config: MenuConfig(
          type: MenuType.custom,
          itemHeight: 80,
          itemWidth: 90,
          borderRadius: const BorderRadius.all(Radius.circular(5)),
          backgroundColor:
              HexColor(ColorsUtils.color3333).withOpacity(0.898039),
        ),
        onDismiss: () {
          Get.log('onDiss');
        });
    controller.menu!.show(widgetKey: controller.iconStoreKey);
  }
}
